<template>
	<view class="content">
		<view class="tabs flexr justify-spacebwt">
			<view class="tab active">全部6</view>
			<view class="tab">未使用4</view>
			<view class="tab">已使用1</view>
			<view class="tab">已过期1</view>
		</view>
		<view class="flex-1">
			<couponItem state="useable"></couponItem>
			<couponItem ></couponItem>
			<couponItem state="giveable"></couponItem>
			<couponItem state="used"></couponItem>
		</view>
	</view>
</template>

<script setup>
import couponItem from '@/widgets/couponItem.vue';
</script>

<style lang="scss">
.content {
	padding: 0 32rpx 32rpx;
	.tabs {
		.tab {
			font-size: 28rpx;
			color: $text-color2;
			height: 95rpx;
			line-height: 95rpx;
			min-height: 95rpx;
			&.active {
				color: $primary-color;
			}
		}
	}
}
</style>
